<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>登录</title>
    <link rel="stylesheet" type="text/css" href="css/login.css"/>
    <script type="text/javascript" src="http://libs.baidu.com/jquery/2.0.0/jquery.js"></script>
    <script type="text/javascript" src="IIInsomniaCityPicker/js/jquery.cookie.js"></script>

    <!--<script type="text/javascript" src="js/YanZhengMa.js"></script>-->
</head>
<body>
<div class="total">
    <div class="header">
        <span class="iconfont icon-guanbi"></span>
    </div>
    <div class="content">
        <p>会员登录</p>
        <form   enctype="multipart/form-data" >
            <p><label>用户名:&nbsp;</label><input type="text" id="name" placeholder="手机号/邮箱/会员号/证件号"/></p>
            <p><label>密　码:&nbsp;</label><input type="password" id="pwd" placeholder="密码"/></p>
            <p>
                <label>验证码:&nbsp;</label><input type="text" id="input" placeholder="请输入验证码"/>
                <input type="button" id="code"/>
            </p>
            <p><input type="button" value="登录" id="check" /></p>
        </form>
    </div>
</div>
</body>


<script type="text/javascript">


  var  LOGIN = {

        checkit: function () {
            //不能为空检查
            if ($("#name").val() == "") {
                alert("用户名不能为空");
                $("#name").focus();
                return false;
            }
            if ($("#pwd").val() == "") {
                alert("密码不能为空");
                $("#pwd").focus();
                return false;
            }
            return true;
           },

        login: function (){
            $.ajax({
                url: "/user/login1",
                type: "post",
               datatype:"json",
                data: {
                    'name': $('#name').val(),
                    'pwd': $('#pwd').val(),
                },

                success: function(data){

//                 var data=JSON.parse(data);
                if (data.status==200){
                    var value=$('#name').val();
                    alert("登录成功！");
                    $.cookie('name', value, {  path: '/' });

                    window.location.href='http://localhost:8080/front/NHhomepage.html';
                    }
                else{
                    alert("登录失败，原因是："+ data.msg);
                    $("#name").select();
                }
            }

           });
        },
      dologin:function(){
            if(this.checkit()){
                this.login();
            }

    }


    }


  $(function(){
      function change(){
          code=$("#code");
          // 验证码组成库
          var arrays=new Array(
              '1','2','3','4','5','6','7','8','9','0',
              'a','b','c','d','e','f','g','h','i','j',
              'k','l','m','n','o','p','q','r','s','t',
              'u','v','w','x','y','z',
              'A','B','C','D','E','F','G','H','I','J',
              'K','L','M','N','O','P','Q','R','S','T',
              'U','V','W','X','Y','Z'
          );
          codes='';// 重新初始化验证码
          for(var i = 0; i<4; i++){
              // 随机获取一个数组的下标
              var r = parseInt(Math.random()*arrays.length);
              codes += arrays[r];
          }
          // 验证码添加到input里
          code.val(codes);
      }
         change();
      code.click(change);
      //单击验证
      $("#check").click(function(){
          var inputCode = $("#input").val().toUpperCase(); //取得输入的验证码并转化为大写
          console.log(inputCode);
          if(inputCode.length == 0) { //若输入的验证码长度为0
              alert("请输入验证码！"); //则弹出请输入验证码
          }
          else if(inputCode!=codes.toUpperCase()) { //若输入的验证码与产生的验证码不一致时
              alert("验证码输入错误!请重新输入"); //则弹出验证码输入错误
//              change();//刷新验证码
              $("#input").val("");//清空文本框
          }else { //输入正确时
              LOGIN.dologin();//弹出^-^
          }
      });
  });


</script>
</html>